/* uni-app 基础样式文件 */

/* 全局样式重置 */
* {
	box-sizing: border-box;
}

body {
	margin: 0;
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background-color: #f5f5f5;
}

/* 页面基础样式 */
page {
	background-color: #f5f5f5;
	font-size: 28rpx;
	color: #333;
	line-height: 1.5;
}

/* 通用工具类 */
.flex {
	display: flex;
}

.flex-column {
	display: flex;
	flex-direction: column;
}

.flex-center {
	display: flex;
	align-items: center;
	justify-content: center;
}

.flex-between {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.flex-around {
	display: flex;
	align-items: center;
	justify-content: space-around;
}

.flex-1 {
	flex: 1;
}

/* 文本对齐 */
.text-left {
	text-align: left;
}

.text-center {
	text-align: center;
}

.text-right {
	text-align: right;
}

/* 文本颜色 */
.text-primary {
	color: #007AFF;
}

.text-success {
	color: #34c759;
}

.text-warning {
	color: #ff9500;
}

.text-error {
	color: #ff3b30;
}

.text-muted {
	color: #999;
}

.text-white {
	color: #fff;
}

/* 背景颜色 */
.bg-primary {
	background-color: #007AFF;
}

.bg-success {
	background-color: #34c759;
}

.bg-warning {
	background-color: #ff9500;
}

.bg-error {
	background-color: #ff3b30;
}

.bg-white {
	background-color: #fff;
}

.bg-gray {
	background-color: #f5f5f5;
}

/* 边距 */
.m-0 { margin: 0; }
.m-1 { margin: 10rpx; }
.m-2 { margin: 20rpx; }
.m-3 { margin: 30rpx; }
.m-4 { margin: 40rpx; }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 10rpx; }
.mt-2 { margin-top: 20rpx; }
.mt-3 { margin-top: 30rpx; }
.mt-4 { margin-top: 40rpx; }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 10rpx; }
.mb-2 { margin-bottom: 20rpx; }
.mb-3 { margin-bottom: 30rpx; }
.mb-4 { margin-bottom: 40rpx; }

.ml-0 { margin-left: 0; }
.ml-1 { margin-left: 10rpx; }
.ml-2 { margin-left: 20rpx; }
.ml-3 { margin-left: 30rpx; }
.ml-4 { margin-left: 40rpx; }

.mr-0 { margin-right: 0; }
.mr-1 { margin-right: 10rpx; }
.mr-2 { margin-right: 20rpx; }
.mr-3 { margin-right: 30rpx; }
.mr-4 { margin-right: 40rpx; }

/* 内边距 */
.p-0 { padding: 0; }
.p-1 { padding: 10rpx; }
.p-2 { padding: 20rpx; }
.p-3 { padding: 30rpx; }
.p-4 { padding: 40rpx; }

.pt-0 { padding-top: 0; }
.pt-1 { padding-top: 10rpx; }
.pt-2 { padding-top: 20rpx; }
.pt-3 { padding-top: 30rpx; }
.pt-4 { padding-top: 40rpx; }

.pb-0 { padding-bottom: 0; }
.pb-1 { padding-bottom: 10rpx; }
.pb-2 { padding-bottom: 20rpx; }
.pb-3 { padding-bottom: 30rpx; }
.pb-4 { padding-bottom: 40rpx; }

.pl-0 { padding-left: 0; }
.pl-1 { padding-left: 10rpx; }
.pl-2 { padding-left: 20rpx; }
.pl-3 { padding-left: 30rpx; }
.pl-4 { padding-left: 40rpx; }

.pr-0 { padding-right: 0; }
.pr-1 { padding-right: 10rpx; }
.pr-2 { padding-right: 20rpx; }
.pr-3 { padding-right: 30rpx; }
.pr-4 { padding-right: 40rpx; }

/* 字体大小 */
.font-xs { font-size: 20rpx; }
.font-sm { font-size: 24rpx; }
.font-base { font-size: 28rpx; }
.font-lg { font-size: 32rpx; }
.font-xl { font-size: 36rpx; }
.font-2xl { font-size: 40rpx; }
.font-3xl { font-size: 48rpx; }

/* 字体粗细 */
.font-normal { font-weight: normal; }
.font-bold { font-weight: bold; }

/* 圆角 */
.rounded-none { border-radius: 0; }
.rounded-sm { border-radius: 4rpx; }
.rounded { border-radius: 8rpx; }
.rounded-lg { border-radius: 12rpx; }
.rounded-xl { border-radius: 16rpx; }
.rounded-2xl { border-radius: 20rpx; }
.rounded-full { border-radius: 50%; }

/* 阴影 */
.shadow-sm {
	box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1);
}

.shadow {
	box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
}

.shadow-lg {
	box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.15);
}

/* 边框 */
.border {
	border: 1rpx solid #e0e0e0;
}

.border-t {
	border-top: 1rpx solid #e0e0e0;
}

.border-b {
	border-bottom: 1rpx solid #e0e0e0;
}

.border-l {
	border-left: 1rpx solid #e0e0e0;
}

.border-r {
	border-right: 1rpx solid #e0e0e0;
}

/* 显示/隐藏 */
.hidden {
	display: none;
}

.visible {
	display: block;
}

/* 定位 */
.relative {
	position: relative;
}

.absolute {
	position: absolute;
}

.fixed {
	position: fixed;
}

/* 宽高 */
.w-full {
	width: 100%;
}

.h-full {
	height: 100%;
}

/* 溢出处理 */
.overflow-hidden {
	overflow: hidden;
}

.overflow-scroll {
	overflow: scroll;
}

/* 文本省略 */
.text-ellipsis {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.text-ellipsis-2 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.text-ellipsis-3 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

/* 按钮基础样式 */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 20rpx 40rpx;
	border-radius: 8rpx;
	font-size: 28rpx;
	border: none;
	cursor: pointer;
	transition: all 0.3s ease;
}

.btn-primary {
	background-color: #007AFF;
	color: #fff;
}

.btn-success {
	background-color: #34c759;
	color: #fff;
}

.btn-warning {
	background-color: #ff9500;
	color: #fff;
}

.btn-error {
	background-color: #ff3b30;
	color: #fff;
}

.btn-outline {
	background-color: transparent;
	border: 1rpx solid #007AFF;
	color: #007AFF;
}

.btn-disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* 卡片样式 */
.card {
	background: #fff;
	border-radius: 12rpx;
	padding: 30rpx;
	box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
}

/* 输入框样式 */
.input {
	width: 100%;
	padding: 20rpx;
	border: 1rpx solid #e0e0e0;
	border-radius: 8rpx;
	font-size: 28rpx;
	background-color: #fff;
}

.input:focus {
	border-color: #007AFF;
	outline: none;
}

/* 标签样式 */
.tag {
	display: inline-block;
	padding: 8rpx 16rpx;
	font-size: 24rpx;
	border-radius: 16rpx;
	background-color: #f0f0f0;
	color: #666;
}

.tag-primary {
	background-color: rgba(0, 122, 255, 0.1);
	color: #007AFF;
}

.tag-success {
	background-color: rgba(52, 199, 89, 0.1);
	color: #34c759;
}

.tag-warning {
	background-color: rgba(255, 149, 0, 0.1);
	color: #ff9500;
}

.tag-error {
	background-color: rgba(255, 59, 48, 0.1);
	color: #ff3b30;
}

/* 加载动画 */
.loading {
	display: inline-block;
	width: 40rpx;
	height: 40rpx;
	border: 3rpx solid #f3f3f3;
	border-top: 3rpx solid #007AFF;
	border-radius: 50%;
	animation: spin 1s linear infinite;
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* 渐变背景 */
.gradient-primary {
	background: linear-gradient(45deg, #007AFF, #0056CC);
}

.gradient-success {
	background: linear-gradient(45deg, #34c759, #28a745);
}

.gradient-warning {
	background: linear-gradient(45deg, #ff9500, #ff5722);
}

.gradient-purple {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

/* 安全区域适配 */
.safe-area-inset-top {
	padding-top: constant(safe-area-inset-top);
	padding-top: env(safe-area-inset-top);
}

.safe-area-inset-bottom {
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

/* 响应式工具类 */
@media screen and (max-width: 750rpx) {
	.sm-hidden {
		display: none;
	}
}

@media screen and (min-width: 750rpx) {
	.lg-block {
		display: block;
	}
}